<!DOCTYPE html>
<html lang="en" xml:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>员工列表</title>
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
  <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
  <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
</head>
<body>
    <div class="container">
        <table class="table table-hover">
            <thead>
                <tr>
                  <th colspan="6">员工列表</th>
                </tr>
              </thead>
          <thead>
            <tr>
              <th>流水号</th>
              <th>员工姓名</th>
              <th>年龄</th>
              <th>性别</th>
              <th>邮箱</th>
              <th>操作</th>
              <th>option(<a th:href="@{/to/add}">add</a>)</th>
            </tr>
          </thead>
          <tbody>
            <tr th:each="employee,status:${page.list}">
                <td th:text="${status.count}"></td>
                <td th:text="${employee.empName}"></td>
                <td th:text="${employee.age}"></td>
                <td th:text="${employee.sex}"></td>
                <td th:text="${employee.email}"></td>
                <td>
                    <form th:action="@{'/employee/page/'+${page.pageNum}+'/'+${employee.empId}}" method="post">
                        <label>
                            <input type="hidden" name="_method" value="delete">
                        </label>
                        <div class="container">
                            <input type="submit" class="btn btn-outline-danger" value="删除">
                        </div>
                    </form>
                    <form th:action="@{'/employee/page/'+${page.pageNum}+'/'+${employee.empId}}" method="get">
                        <div class="container">
                            <input type="submit" class="btn btn-outline-warning" value="修改">
                        </div>
                    </form>
                </td>
            </tr>
          </tbody>
        </table>
      </div>
      <div class="container">
        <ul class="pagination">
            <li class="page-item">
                <a class="page-link" th:if="${page.hasPreviousPage}" th:href="@{/employee/page/1}">首页</a>
            </li>
            <li class="page-item">
                <a class="page-link" th:if="${page.hasPreviousPage}" th:href="@{'/employee/page/'+${page.prePage}}">上一页</a>
            </li>

            <li class="page-item" th:each="num : ${page.navigatepageNums}">
                <a th:if="${page.pageNum == num}" style="background-color: skyblue;" class="page-link" th:href="@{'/employee/page/'+${num}}" th:text="${num}"></a>
                <a th:if="${page.pageNum != num}" class="page-link" th:href="@{'/employee/page/'+${num}}" th:text="${num}"></a>
            </li>

            <li class="page-item">
                <a class="page-link" th:if="${page.hasNextPage}" th:href="@{'/employee/page/'+${page.nextPage}}">下一页</a>
            </li>
            <li class="page-item">
                <a class="page-link" th:if="${page.hasNextPage}" th:href="@{'/employee/page/'+${page.pages}}">末页</a>
            </li>
          </ul>
      </div>
        

</body>
</html>